<template>
	<view class="_stadium_card_home u-flex" @click="info">
		<image class="_img" :src="stadium.image"></image>
		<view class="_right_area">
			<view class="f-s-14">{{ stadium.name }}</view>
			<view class="u-info f-s-12 u-m-t-18">{{ stadium.address }}</view>
			<view class="u-flex u-flex-between u-flex-items-center u-m-t-18">
				<view class="u-warning f-s-12">火热预订中</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	// props
	const props = defineProps({
		stadium: {
			type: Object,
			default: () => ({}) // 默认值为空对象
		}
	})
	if (props.stadium.image) {
		props.stadium.image = props.stadium.image.split(',')[0]
	}
	// 跳转详情
	const info = () => {
		uni.navigateTo({
			url: `/subPackages/stadium/info?id=${props.stadium.id}`
		})
	}
</script>

<style lang="scss" scoped>
	._stadium_card_home {
		margin-bottom: 15px;
		border-radius: 12px;
		background-color: #fff;
		height: 110px;
		box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.10);

		._img {
			border-radius: 12px 0 0 12px;
			width: 140px;
			height: 100%;
		}

		._right_area {
			flex: 1;
			border-radius: 0 12px 12px 0;
			padding: 16px;
		}

	}
</style>